<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
    <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Sign Up</title>
</head>
<style type="text/css">
input {float:right;}
form {width:400px;}
</style>

<script language="javascript" src="template/fieldcheck.js"></script>

	
<body>
<p>Sign Up</p>
<form id="form1" name="form1" method="post" action="?action=user.signup">
<c:if test="${error}"><font color ="red"> Some error need to be fixed: </font><br /></c:if>
<c:if test="${invalidUserName}"><font color ="red">  o Invalid User Name! </font><br /></c:if>
<c:if test="${invalidEmail}"><font color ="red">  o Invalid Email! </font><br /></c:if>
<c:if test="${invalidPass}"><font color ="red">  o Invalid Password! </font><br /></c:if>
<c:if test="${userExist}"><font color ="red">  o User Name is not available! </font><br /></c:if>
<c:if test="${emailUnavailable}"><font color ="red">  o Email is already taken! </font><br /></c:if>
<c:if test="${sqlError}"><font color ="red">  o Database Error! </font><br /></c:if>
  <br />
  <label>User Name *
  <input style="width: 250px;" type="text" name="userName" id="userName" value = "${param.userName}" onblur="is_user(document.getElementById('userName'));"  />
  </label>
  <p>
    <label>Password *
    <input style="width: 250px;" type="password" name="password" id="password" onblur="is_empty(document.getElementById('password'));confirm_pass(document.getElementById('password'),document.getElementById('confirmPass'));" />
    </label>
  </p>
  <p>
    <label>Confirm Password *
    <input style="width: 250px;" type="password" name="confirmPass" id="confirmPass" onblur="is_empty(document.getElementById('confirmPass'));confirm_pass(document.getElementById('password'),document.getElementById('confirmPass'));" />
    </label>
</p>
  <p>
    <label>Full Name *
    <input style="width: 250px;" type="text" name="fullName" id="fullName" value = "${param.fullName}" onblur="is_empty(document.getElementById('fullName'));"/>
    </label>
  </p>
  <p>
    <label>E-mail *
    <input style="width: 250px;" type="text" name="userEmail" id="userEmail" value = "${param.userEmail}" onblur="is_email(document.getElementById('userEmail'));"/>
    </label>
  </p>
  <p>&nbsp;</p>
  <p>
    <input style="margin-left:200px; float:none;" type="submit" name="signUp" id="signUp" value="Sign Up" />
    <input style="margin-left:0px; float:none;" type="reset" name="resetAll" id="resetAll" value="Reset All" />
    
  </p>
  <p><a href="/tracnghiem/home" title="home" target="_self"> Home</a></p>
</form>
<p>&nbsp; </p>
</body>
</html>